<!DOCTYPE html>
<html lang="en">
<head>
    <!-- 页面meta -->
    <meta charset="UTF-8">
    <title>客户体检信息健康管理系统</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="客户体检信息健康管理系统">
    <meta name="keywords" content="客户体检信息健康管理系统">
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
    <!-- 引入样式 -->
    <link rel="stylesheet" href="../plugins/elementui/index.css">
    <link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="../css/style.css">
    <style>
        .title {
            text-align: center;
            margin: 20px 0px;
        }
    </style>
</head>
<body>
<div id="app">
    <div class="content-header">
        <h1>健康评估<small>亚健康评估问卷</small></h1>
        <el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item>健康评估</el-breadcrumb-item>
            <el-breadcrumb-item>亚健康评估问卷</el-breadcrumb-item>
        </el-breadcrumb>
    </div>
    <div class="app-container">
        <div class="box">
            <el-form ref="ruleForm" label-width="auto" class="demo-ruleForm">
                <el-form-item v-for="(item,index) in arr" :key="index" :label="(index+1)+' '+item.title">
                    <el-checkbox-group v-model="item.type" :max="1">
                        <el-checkbox label="没有"></el-checkbox>
                        <el-checkbox label="有时有" @change="changeScore5"></el-checkbox>
                        <el-checkbox label="一直都是" @change="changeScore10"></el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="submitForm()">提交</el-button>
                    <el-button @click="resetForm()">重置</el-button>
                </el-form-item>
            </el-form>
        </div>

    </div>
</div>
</div>
</body>
<!-- 引入组件库 -->
<script src="../js/vue.js"></script>
<script src="../plugins/elementui/index_copy.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/axios-0.18.0.js"></script>
<script>
    const vm = new Vue({
        el: '#app',
        data() {
            return {
                arr: [
                    {
                        title: '是不是早上不想起床，即使起床也觉得浑身疲倦，整天打哈欠？',
                        type: []
                    },
                    {
                        title: '有没有觉得食欲差，什么也不想吃，但见到辛辣刺激或油炸食品就来劲？',
                        type: []
                    }, {
                        title: '有没有觉得肩颈部容易酸痛，或者手脚发胀、发麻、发凉，又或者经常腹胀、腹泻、便秘？',
                        type: []
                    },
                    {
                        title: '有没有觉得别人都不好，都不理解你，脾气变得很坏，容易烦躁不安，事后又有所察觉，似乎自己太多事，钻了牛角尖？',
                        type: []
                    },
                    {
                        title: '天气变化，各种“流”侵袭，你是否首当其冲？',
                        type: []
                    }, {
                        title: '总是想用茶或者咖啡来提神。',
                        type: []
                    }
                    , {
                        title: '有没有不明原因的体重下降，或者精力不济、体力不支，又或者身体有无名疼痛又检查不出病？',
                        type: []
                    }
                    , {
                        title: '是不是经常不吃早餐或者吃饭时间不固定？',
                        type: []
                    }
                    , {
                        title: '即使剧烈运动后也很少出汗。',
                        type: []
                    },
                    {
                        title: '注意力难以集中或健忘，越是眼前的事越容易忘掉。',
                        type: []
                    },
                    /*{
                        title: '是否经常情绪不舒感到有些抑郁，喜欢一个人发呆，不喜欢融入群体。',
                        type: []
                    },
                    {
                        title: '厌倦运动甚至懒得爬楼，或者爬楼时出现绊脚、膝盖酸软、腿脚无力的现象。',
                        type: []
                    }
                    , {
                        title: '会不会有心悸、胸闷、厌烦的感觉？',
                        type: []
                    }
                    , {
                        title: '回到家总是懒动，喜欢躺在沙发上，并把腿抬高才能感到舒服些。',
                        type: []
                    }
                    , {
                        title: '总是失眠，不易入睡或者容易惊醒，或者总是处于梦中，睡眠质量很差。并有脱发现象。',
                        type: []
                    }*/
                ],
                score: 100,
            };
        },
        methods: {
            changeScore5() {
                this.score = this.score - 5
            },
            changeScore10() {
                this.score = this.score - 10
            },
            submitForm() {
                let arr = this.arr;
                //判断数组是否选中
                for (let i = 0; i < arr.length; i++) {
                    console.log(arr[i])
                    if (arr[i].type.length === 0) {
                        this.$message({
                            message: "请至少选择一个",
                            type: "error"
                        })
                        return;
                    }
                }
                //判断分数
                if (this.score > 90) {
                    this.$confirm(`你的得分是${this.score}分! 您的身体倍儿棒，继续保持良好的生活习惯，保持积极乐观心态、疾病会离你远远滴`, '结果', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    })
                } else if (this.score >= 70 && this.score < 90) {
                    this.$confirm(`你的得分是${this.score}分! 您的身体倍儿棒，继续保持良好的生活习惯，保持积极乐观心态、疾病会离你远远滴`, '结果', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    })
                } else if (this.score >= 50 && this.score < 70) {
                    this.$confirm(`你的得分是${this.score}分! 黄色预警信号启动，您已处于中度亚健康状态，生命运动急需加强，生活饮食习惯急需改正`, '结果', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    })
                } else if (this.score >= 25 && this.score < 50) {
                    this.$confirm(`你的得分是${this.score}分! 您的身体已经亮红灯了！请以健康的名义狠狠地爱自己！`, '结果', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    })
                } else if (this.score >= 0 && this.score < 25) {
                    this.$confirm(`你的得分是${this.score}分! 不带这么折磨自己的！强烈建议，赶紧就医检查。`, '结果', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    })
                }
                this.resetForm();
            },
            resetForm() {
                for (let i = 0; i < this.arr.length; i++) {
                    this.arr[i].type = []
                }
            }
        }
    })
</script>
</html>